<template>
	<view class="">
		<view class="swiperList">
		<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true">
			<swiper-item v-for="item in titleList">
				<view class="swiper-item uni-bg-red">
					<image :src="item.avatarUrl" mode=""></image>
					<view class="ve">{{item.nickname}}成功邀请{{item.helpUserCount}}个人 获得{{item.discount}}折优惠</view>
				</view>
			</swiper-item>
		</swiper>
		</view>
		<view class="top">
			<view class="me" v-show="photo!=undefined">
				<image :src="photo" mode=""></image>
			</view>
			<view class="txt">
			已有{{List.length}}人为他助力
			</view>
			<view class="btn" @click="naviageToPage('/pages/parity/parity?type=6&id=49&title=掌柜推荐')"></view></view>
		<view class="box"></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			p: '',
			people: '',
			photo:'',
			background: ['color1', 'color2', 'color3'],
			indicatorDots: true,
			autoplay: true,
			interval: 2000,
			duration: 500,
			titleList: '',
			List:''
		};
	},
	onLoad(options) {
		console.log(options);
		if (options.people) {
			
			this.people = options.people;
			uni.setStorageSync('people', options.people);
			console.log(this.people, 11111);
			// this.$store.commit('setStorageCode', options.p)
		}
		wx.hideHomeButton();
	},
	onShow() {
		this.photo=uni.getStorageSync('userInfo').avatarUrl
		this.showTitle()
		this.showAllList()
		// console.log(this.photo);
	},
	methods: {
	
		showTitle() {
			uni.showLoading({
				title: '请稍后..',
				mask: true
			});
			this.$api.request('goods', 'getHelpSuccessUser', {}).then(res => {
				uni.hideLoading();
				// console.log(res);
				this.titleList=res.data
			});
		},
		naviageToPage(page) {
			let that = this;
			console.log(that.people, 2222);
			if (this.$store.state.userInfo.accessToken) {
				uni.showModal({
					title: '提示',
					content: '好友助力',
					confirmText: '前往助力',
					cancelText: '继续买菜',
					success: res => {
						if (res.confirm) {
							this.$api
								.request('order', 'userHelpOrder', {
									orderNo: that.people,
									helpUserId: uni.getStorageSync('userInfo').id
								})
								.then(res => {
									uni.hideLoading();
									uni.showToast({
										title: res.errmsg,
										icon: 'none'
									});
									setTimeout(() => {
										uni.switchTab({
											url: '../index/index'
										})
									}, 1000);
									// console.log(res);
								});
							// uni.navigateTo({
							// 	url:'share'
							// })
						} else {
							uni.switchTab({
								url: '../index/index'
							});
						}
					}
				});
			} else {
				uni.navigateTo({
					url: '../public/login'
				});
			}
		},
		showAllList() {
			console.log(33);
			this.$api
				.request('order','userHelpList', {
					orderNo: this.people
				})
				.then(res => {
					uni.hideLoading();
					// console.log(res);
					this.List = res.data;
				});
		}
	}
};
</script>

<style lang="scss">
page {
	width: 100%;
	height: 100%;

	background: #f3f4f5;
	// background: url(https://laileme123.oss-cn-shanghai.aliyuncs.com/bg/a2fe009faf2e4452bae29157e91b1556.png) no-repeat center;
	// background-size: 100% 100%;
	// padding-top: 1000rpx;
	// box-sizing: border-box;
}
.swiperList {
	position: fixed;
	top: 0;
	width: 440rpx;
	height: 56rpx;
	background-color: #000000;
	opacity: 0.5;
	border-radius: 999rpx;
	color: #ffffff;
	.swiper {
		
		width: 100%;
		height: 100%;
		.swiper-item {
			width: 100%;
			height: 100%;
			display: flex;
			align-items: center;
			font-size: 24rpx;

			image {
				width: 56rpx;
				height: 56rpx;
				border-radius: 999rpx;
				margin-right: 9rpx;
			}
		}
	}
}
// .Invitation {
// 	background-color: #f4f6fa;
// 	min-height: 100vh;

// 	.btn {
// 		margin: 110px auto 0;
// 		width: 77%;
// 		height: 45px;
// 		background-color: #ef570d;
// 		text-align: center;
// 		line-height: 45px;
// 		color: #fff;
// 		border-radius: 45rpx;
// 	}
// }
// .btn {
// 	width: 300rpx;
// 	height: 150rpx;
// 	margin: 0 auto;
// 	image {
// 		width: 100%;
// 		height: 100%;
// 	}
// }
.top {
	width: 100%;
	height: 756rpx;
	background: url(https://laileme123.oss-cn-shanghai.aliyuncs.com/bg/49a0ab2f549640dab4bebc7bbe76a0b3.png) no-repeat center;
	background-size: 100% 100%;
	padding-top: 435rpx;
	box-sizing: border-box;
	.me{
		width: 100%;
		text-align: center;
		image{
			width: 108rpx;
			height: 108rpx;
			border-radius: 999rpx;
		}
	}
	.txt{
		width: 100%;
		text-align: center;
		
		font-size: 20rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
		}
}
.btn {
	width: 80%;
	height: 88rpx;
	margin: 0 auto;
	margin-top: 40rpx;
	// background-color: red;
	background: url(https://laileme123.oss-cn-shanghai.aliyuncs.com/bg/775c5eae6a4c4b4d8b4442634541dddb.png) no-repeat center;
	background-size: 100% 100%;
}
.box {
	width: 90%;
	margin: 0 auto;
	margin-top: 20rpx;
	height: 985rpx;
	background: url(https://laileme123.oss-cn-shanghai.aliyuncs.com/bg/eb7ff1211ce54444979a1779148b6b6d.png) no-repeat center;
	background-size: 100% 100%;
}
</style>
